<template>
  <div>
    <comment :commentLists="item" v-for="(item,index) in commentLists" :key="index" />

    <!-- 地图 -->
    <div id="container"></div>
  </div>
</template>

<script>
import comment from "@/components/test/comment";

export default {
  components: {
    comment
  },

  // 评论数据
  data() {
    return {
      commentLists: [
        {
          comment: "看个人发展的情况吧！",
          parent: {
            comment: "前端35岁后就会失业吗？"
          }
        },
        {
          comment: "个人感觉后者~",
          parent: {
            comment: "前端跟后端哪个更难学？"
          }
        },
        {
          comment: "那就保持下去哦~",
          parent: {
            comment: "今天的状态很好"
          }
        },
        {
          comment: "相信有好结果，真所谓，十年寒窗苦读，今朝金榜题名时",
          parent: {
            comment: "终于体会到台上一分钟，台下十年功"
          }
        }
      ]
    };
  },

  // 高德地图
  mounted() {
    // 2.地图库加载完毕的回调函数
    window.onLoad = function() {
      var map = new AMap.Map("container");
    };

    // 1.加载高德地图库
    var url =
      "https://webapi.amap.com/maps?v=1.4.15&key=1d2a4f11df5502f6f56e25d11e602ab3&callback=onLoad";
    var jsapi = document.createElement("script");
    jsapi.charset = "utf-8";
    jsapi.src = url;
    document.head.appendChild(jsapi);
  }
};
</script>

<style lang="less" scoped>
#container{
  width: 500px;
  height: 500px;
}
</style>